<div class="container">
        <div class="row">
            <div class="col-sm-12 col-lg-6 offset-lg-3 my-5">
            <RadzenCard class="w-100 mb-4" >
                <RadzenCheckBox @bind-Value="@showDataLabels" Name="dataLabels"></RadzenCheckBox>
                <RadzenLabel Text="Show Data Labels" For="dataLabels" Style="margin-left: 8px; vertical-align: middle;" />
            </RadzenCard>
            <RadzenChart SeriesClick=@OnSeriesClick>
                <RadzenPieSeries Data="@revenue" Title="Revenue" CategoryProperty="Quarter" ValueProperty="Revenue">
                    <RadzenSeriesDataLabels Visible="@showDataLabels" />
                </RadzenPieSeries>
            </RadzenChart>
        </div>
    </div>
</div>

<EventConsole @ref=@console />

@code {
    EventConsole console;
    bool showDataLabels = false;

    void OnSeriesClick(SeriesClickEventArgs args)
    {
        console.Log(args);
    }

    class DataItem
    {
        public string Quarter { get; set; }
        public double Revenue { get; set; }
    }

    DataItem[] revenue = new DataItem[] {
        new DataItem
        {
            Quarter = "Q1",
            Revenue = 30000
        },
        new DataItem
        {
            Quarter = "Q2",
            Revenue = 40000
        },
        new DataItem
        {
            Quarter = "Q3",
            Revenue = 50000
        },
        new DataItem
        {
            Quarter = "Q4",
            Revenue = 80000
        },
    };
}